import { Marked } from "marked";
import { markedHighlight } from "marked-highlight";
import hljs from "highlight.js";
// const style = import("highlight.js/styles/monokai-sublime.css");
// console.log(style);
// import pygmentize from "pygmentize-bundled";

import * as htmls from "./assets/test.md";
// const Test = import("./assets/test.md");
// marked.setOptions({
//   renderer: new marked.Renderer(),
//   highlight: function (code, lang) {
//     const language = hljs.getLanguage(lang) ? lang : "plaintext";
//     return hljs.highlight(code, { language }).value;
//   },
//   langPrefix: "hljs language-", // highlight.js css expects a top-level 'hljs' class.
//   pedantic: false,
//   gfm: true,
//   breaks: false,
//   sanitize: false,
//   smartLists: true,
//   smartypants: false,
//   xhtml: false,
// });
const marked = new Marked(
  markedHighlight({
    langPrefix: "hljs language-",
    highlight(code, lang) {
      const language = hljs.getLanguage(lang) ? lang : "plaintext";
      return hljs.highlight(code, { language }).value;
      // return new Promise((resolve, reject) => {
      //   pygmentize({ lang, format: "html" }, code, function (err, result) {
      //     if (err) {
      //       resolve(err);
      //       return;
      //     }

      //     resolve(result.toString());
      //   });
      // });
    },
  })
);
const { html, toc, meta, markdown } = htmls;
const result = marked.parse(markdown);
console.log(htmls);

app.innerHTML = result;
